<template>
 <el-table
    :data="tableData"
    stripe
     class="box">
    <el-table-column
      prop="name"
      label="有声童话"
      width="200">
    </el-table-column>
    <el-table-column
      prop="number"
      label="字数"
      width="200">
    </el-table-column>
    <el-table-column
      prop="time"
      label="朗读时间">
    </el-table-column>
     <el-table-column
      prop="declaimer"
      label="朗读者">
    </el-table-column>
  </el-table>
  </template>
  
  <style>
  .box{
  
    margin: auto;
    width: 400px;;
  }
  </style>

<script>
 export default {
        data() {
      return {
        tableData: [ {
          name: '三只小猪',
          word: '300字',
          time: '10min',
          declaimer: '谷江山'
        },{
          name: '睡美人',
          word: '400字',
          time: '11min',
          declaimer: '沫沫'
        },{
          name: '小绿狼',
          word: '200字',
          time: '7min',
          declaimer: '桃桃'
        },{
          name: '小鱼历险记',
          word: '184字',
          time: '8min',
          declaimer: '暖暖'
        },{
          name:'白雪公主',
          word:'300字',
          time:'8min',
          declaimer:'花花'
        },]
      }
    }
    }
</script>